<%@page contentType="text/html;charset=UTF-8"%>
<%@include file="../common.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Application List</title>
	<link href="${ctx}/resources/css/bootstrap/dashboard.css" rel="stylesheet">
	<link href="${ctx}/resources/css/bootstrap/bootstrap.min.css" rel="stylesheet">

	<script type="text/javascript" src="${ctx}/resources/js/highcharts/jquery-1.8.2.min.js"></script>
	<script src="${ctx}/resources/js/monitor/xl-monitor.js"></script>
    <%@include file="../common/head.jsp"%>
    <link href="${ctx}/resources/font-awesome/css/font-awesome.min.css" rel="stylesheet">

	<style type="text/css">
		${demo.css}
		.col-sm-3{
			width : 33%;
		}
        table{table-layout: fixed}
	</style>

    <script language="javascript">
        function openShell(type,ip){
            var url =ctx+'/shell';
            $('#type').val(type);
            $('#ip').val(ip);
            document.getElementById('openWindow').setAttribute('action', url);
            document.getElementById('openWindow').submit();
        }

        function openCShell(type,ip){
            var url ='chrome-extension://pnhechapfaindjhompbnflcldabbghjo/html/nassh.html?ip='+ip;
            $('#type').val(type);
            $('#ip').val(ip);
            document.getElementById('openWindow').setAttribute('action', url);
            document.getElementById('openWindow').submit();
        }
    </script>

</head>
<body>
<div class="p10 bg-fff">
    <div class="ant-breadcrumb">
            <span>
                <span class="ant-breadcrumb-link">首页</span>
                <span class="ant-breadcrumb-separator">/</span>
            </span>
            <span >
                <span class="ant-breadcrumb-link">监控列表</span>
                <span class="ant-breadcrumb-separator" >/</span>
            </span>
    </div>
</div>

<form id="openWindow" target="_blank" action="">
    <input id="type" name="type" type="hidden"/>
    <input id="ip" name="ip" type="hidden"/>
</form>

<div class="container-solid">

    <div class="p20">
        <div class="bg-fff">
        <ul class="ant-menu ant-menu-horizontal  ant-menu-light ant-menu-root">
            <li class="<c:if test="${type == 'TEST'}">ant-menu-item-selected</c:if> ant-menu-item" >
                <a href="${ctx}/k8/list?type=TEST&namespace=default"><span>测试环境</span></a>
            </li>
            <li class="<c:if test="${namespace == 'prerelease'}">ant-menu-item-selected</c:if> ant-menu-item" >
                <a href="${ctx}/k8/list?type=PRODUCT&namespace=prerelease"><span>预发布环境</span></a>
            </li>
            <li class="<c:if test="${type == 'PRODUCT' && namespace == 'default'}">ant-menu-item-selected</c:if> ant-menu-item" >
                <a href="${ctx}/k8/list?type=PRODUCT&namespace=default"><span>正式环境</span></a>
            </li>
        </ul>
        <div class="table-responsive">
            <table class="table table-striped table-hover">
                <thead>
                <tr>
                    <th>服务名</th>
                    <th>节点数</th>
                    <th>HostIp</th>
                    <th>PodIp</th>
                    <th>端口</th>
                    <th>状态</th>
                    <th>系统类型</th>
                    <th>版本号</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${services}" var="service" varStatus="serviceStatus">
                    <tr>
                        <td>${service.name}</td>
                        <td>${service.replicas}</td>
                        <td>${service.hostIp}</td>
                        <td>
                            <a href="javascript:openCShell('${type}','${service.podIp}')">${service.podIp}</a>
                            <a href="javascript:openShell('${type}','${service.podIp}')"><i class="fa fa-bolt fa-fw"></i></a>
                        </td>
                        <td>${service.nodePort}</td>
                        <td>
                            <c:choose>
                                <c:when test="${service.status=='Running'}">
                                    <span class="label label-success">Running&nbsp;</span>
                                </c:when>
                                <c:when test="${service.status=='Pending'}">
                                    <span class="label label-success" data-toggle="tooltip" title="${service.msg}">Pending&nbsp;</span>
                                </c:when>
                                <c:otherwise>
                                    <span class="label label-default" data-toggle="tooltip" title="${service.msg}">Unknow&nbsp;</span>
                                </c:otherwise>
                            </c:choose>
                        </td>
                        <td>
                            <c:choose>
                                <c:when test="${service.type=='APP'}">
                                    <span class="label label-primary">业务应用&nbsp;</span>
                                </c:when>
                                <c:otherwise>
                                    <span class="label label-info">系统应用&nbsp;</span>
                                </c:otherwise>
                            </c:choose>
                        </td>
                        <td><a href="#">${service.version}</a></td>
                        <td>
                            <c:if test="${not empty service.uuid}">
                                <a class="btn btn-sm btn-info" href="${ctx}/job/query?uuid=${service.uuid}">查看</a>
                            </c:if>
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
        </div>
    </div>
</div>
</body>
</html>
